<%@page pageEncoding="UTF-8" contentType="text/html;charset=UTF-8"%>
<link href="${apliPath}static/css/default.css" rel="stylesheet"
	type="text/css" />
<link rel="stylesheet" type="text/css"
	href="${apliPath}static/js/themes/metro-solidBlue/easyui.css" />
<link rel="stylesheet" type="text/css"
	href="${apliPath}static/js/themes/icon.css" />
<script type="text/javascript" src="${apliPath}static/js/jquery-1.10.2.js"></script>
<script type="text/javascript" src="${apliPath}static/js/jquery.easyui.min.js"></script>
<script type="text/javascript" src="${apliPath}static/js/locale/easyui-lang-zh_CN.js"></script>
<script type="text/javascript">
	$(function() {
		$("#manageArticle")
				.datagrid(
						{
							title : "文章列表",
							fit : true,
							border : false,
							toolbar : '#toolBar',
							iconCls : 'icon-search',
							url : "${apliPath}article/queryArticlesByPage",
							fitColumns : true,
							striped : true,
							loadMsg : "数据正在加载中，请稍等...",
							rownumbers : true,
							checkOnSelect : false,
							columns : [ [
									{
										field : "id",
										checkbox : true,
									},
									{
										title : "标题",
										field : "title",
										width : 100,
									},
									{
										title : "阅读量",
										field : "viewTimes",
										width : 70,
										sortable : true,
									},
									{
										title : "发布日期",
										field : "writeTime",
										width : 70,
									},
									{
										title : "可读状态",
										field : "useStatus",
										width : 100,
									},
									{
										title : "作者",
										field : "mentor",
										width : 80,
										formatter : function(value, row, index) {
											return value.mentorName;
										}
									},
									{

										title : "编辑操作",
										field : "opt",
										width : 80,
										formatter : function(value, row, index) {
											return '<a class="delcls" onclick="delArticle('
													+ row.id
													+ ')" href="javascript:void(0)"></a><a class="modifyArticlecls" onclick="modifyArticle('
													+ index
													+ ')" href="javascript:void(0)"></a>';
										}

									} ] ],
							onLoadSuccess : function(data) {
								$('.delcls').linkbutton({
									text : '删除',
									plain : true,
									iconCls : 'icon-edit'
								});
								$('.modifyArticlecls').linkbutton({
									text : '更新',
									plain : true,
									iconCls : 'icon-edit'
								});
							},
							pagination : true,
							pageSize : 6,
							pageList : [ 3, 6, 9, 12 ],
							sortName : "viewTimes",
							sortOrder : "DESC",
							remoteSort : false,
						});

	});

	function modifyArticle(index) {
		$.get(
						"${apliPath}mentor/queryMentorsByPage?page=1&rows=12&sort=id&order=desc",
						function(data) {
							var localData = data.rows;
							$('#cc').combobox({
								data : localData,
								valueField : 'id',
								textField : 'mentorName'
							});
							$("#cc").combobox('select', rows[index].mentor.id);
						});
		var rows = $("#manageArticle").datagrid("getRows");
		var value = document.createTextNode(rows[index].content);
		document.getElementById("spanContent").innerHTML="";
		document.getElementById("spanContent").appendChild(value);
		$('#w').window({
			top : 30,
			height : 500,
			width : 700,
			left : 200,
			modal : true,
		});
		$("#w").form('load', {
			id : rows[index].id,
			useStatusBy : rows[index].useStatus,
			title : rows[index].title,
			writeTime : rows[index].writeTime,
			picture : rows[index].picture,
		});
		var picture = document.getElementById("picture").value;
		document.getElementById("pictureShow").src = "${apliPath}static/pic/article_pic/"
				+ picture;
		$("#w").window('open');
		var select = document.getElementById("useStatus");
		select.innerHTML = "";
		var option = document.createElement("option");
		option.value = "0";
		var value1 = document.createTextNode("可用");
		option.appendChild(value1);
		select.appendChild(option);
		var option2 = document.createElement("option");
		option2.value = "1";
		var value2 = document.createTextNode("不可用");
		option2.appendChild(value2);
		select.appendChild(option2);
		for ( var i = 0; i < select.options.length; i++) {
			var status = document.getElementById("useStatusBy").value;
			if (select.options[i].value == status) {
				select.options[i].selected = true;
			}
		}
	

	}
	function modifyArticleSubmit() {
		var spanContent = document.getElementById("spanContent").innerHTML;
		document.getElementById("content").value = spanContent;

		$("#modifyForm").form('submit', {
			url : "${apliPath}article/modify",
			success : function(data) {
				$("#w").window('close');
				$.messager.show({
					title : "提示框",
					msg : "修改成功",
				});
				$("#manageArticle").datagrid("reload");
			}
		});
		$("#w").window('close');
	}

	function delArticle(index) {
		var transData = {
			drops : index,
		};
		$.post("${apliPath}article/drop", transData, function(data) {
		$("#manageArticle").datagrid("reload");
		});
		
	}
	function delArticles() {
		var rows = $("#manageArticle").datagrid("getSelections");
		var dropsArray = [];

		for ( var i = 0; i < rows.length; i++) {
			dropsArray.push(rows[i].id);
		}
		$.post("${apliPath}article/drop", {
			"drops" : dropsArray.toString()
		}, function(data) {
		$("#manageArticle").datagrid("reload");
		});
		
	}
</script>

<table id="manageArticle">
</table>

<div id="toolBar" style="float: right">
	<table>
		<tr>
			<td><a href="javascript:void(0)" class="easyui-linkbutton"
				data-options="iconCls:'icon-cancel',plain:true" onclick="delArticles()"> 删除</a></td>
			<td><span style="font-size:12px">查询文章</span>&nbsp;<input
				type="text" size="26px" value = "此功能不可用，原因是没写" /></td>
		</tr>
	</table>
</div>



<div id="w" class="easyui-window" title="文章信息"
	data-options="iconCls:'icon-save',closed:true"
	style="width:600px;height:200px;padding:5px;">
	<div class="easyui-layout" data-options="fit:true">
		<div data-options="region:'east'" style="width:250px">
			<form method="post" id="modifyForm" enctype="multipart/form-data">
				<table>
					<tr>
						<td colspan="2"><input style="display: none;" name="picture"
							id="picture" type="text">展示图片<img width="200px"
							id="pictureShow">更改<input name="displayPic" type="file" />
						</td>
					</tr>
					<tr>
						<td>标题<input type="text" id="content" name="content"
							style="display: none;"></td>
						<td><input type="text" name="title"></td>
					</tr>
					<tr>
						<td>写入时间</td>
						<td><input type="text" name="writeTime" readonly="readonly">
						</td>
					</tr>
					<tr>
						<td>可用状态<input type="text" name="id" style="display: none;">
						</td>
						<td><input name="useStatusBy" style="display: none;"
							type="text"><select name="useStatus" id="useStatus">
						</select></td>
					</tr>
					<tr>
						<td>作者</td>
						<td><input id="cc" name="mentor.id" class="easyui-combobox" />
						</td>
					</tr>
				</table>
			</form>
		</div>
		<div>
			<h2>文章内容</h2>
			<div style="width: 300px">
				<span id="spanContent" contenteditable="true"></span>
			</div>
			<input type="text" style="display: none" name="summary" id="summary">
		</div>
		<div data-options="region:'south',border:false"
			style="text-align:right;padding:5px 0 0;">
			<a class="easyui-linkbutton" data-options="iconCls:'icon-ok'"
				href="javascript:void(0)" onclick=" modifyArticleSubmit()"
				style="width:80px">Ok</a> <a class="easyui-linkbutton"
				data-options="iconCls:'icon-cancel'" href="javascript:void(0)"
				onclick="javascript:alert('cancel')" style="width:80px">Cancel</a>
		</div>
	</div>
</div>









